﻿@page "/dialog"
@using System.Timers
@inject DialogService DialogService
@implements IDisposable

<RadzenExample Name="Dialog" Documentation="true" AdditionalSourceCodePages=@(new [] { "DialogCardPage.razor" })>
    <div class="row">
        <div class="col-xl-6">
            <h3>Open page as a dialog</h3>
            <RadzenButton Text=@($"Show OrderID: {orderID} details") Click=@OpenOrder />
            <h3 style="margin-top: 20px;">Inline Dialog</h3>
            <RadzenButton Text="Show dialog with inline Blazor content" Click=@ShowInlineDialog />
            <h3 style="margin-top: 20px;">Busy Dialog with a string message</h3>
            <RadzenButton Text="Show busy dialog" Click=@(args => ShowBusyDialog(true)) />
            <h3 style="margin-top: 20px;">Busy Dialog with markup</h3>
            <RadzenButton Text="Show busy dialog" Click=@(args => ShowBusyDialog(false)) />
            <h3 style="margin-top: 20px;">Confirm Dialog</h3>
            <RadzenButton Text="Show confirm dialog" Click=@(args => DialogService.Confirm("Are you sure?", "MyTitle", new ConfirmOptions() { OkButtonText = "Yes", CancelButtonText = "No" })) />
        </div>
        <div class="col-xl-6">
            <EventConsole @ref=@console />
        </div>
    </div>
</RadzenExample>

@code {
    EventConsole console;
    int orderID = 10248;

    protected override void OnInitialized()
    {
        DialogService.OnOpen += Open;
        DialogService.OnClose += Close;
    }

    public void Dispose()
    {
        // The DialogService is a singleton so it is advisable to unsubscribe.
        DialogService.OnOpen -= Open;
        DialogService.OnClose -= Close;
    }

    void Open(string title, Type type, Dictionary<string, object> parameters, DialogOptions options)
    {
        console.Log("Dialog opened");
    }

    void Close(dynamic result)
    {
        console.Log($"Dialog closed");
    }

    public async Task OpenOrder()
    {
        await DialogService.OpenAsync<DialogCardPage>($"Order {orderID}",
               new Dictionary<string, object>() { { "OrderID", orderID } },
               new DialogOptions() { Width = "700px", Height = "530px" });
    }

    async Task ShowInlineDialog()
    {
     var result = await DialogService.OpenAsync("Simple Dialog", ds =>
        @<div>
            <p Style="margin-bottom: 1rem">Confirm?</p>
            <div class="row">
                <div class="col-md-12">
                    <RadzenButton Text="Ok" Click="() => ds.Close(true)" Style="margin-bottom: 10px; width: 150px" />
                    <RadzenButton Text="Cancel" Click="() => ds.Close(false)" ButtonStyle="ButtonStyle.Secondary"  Style="margin-bottom: 10px; width: 150px"/>
                    <RadzenButton Text="Refresh" Click="(() => { orderID = 10249; ds.Refresh(); })" ButtonStyle="ButtonStyle.Info"  Style="margin-bottom: 10px; width: 150px"/>
                    Order ID: @orderID
                </div>
            </div>
        </div>);
    
      console.Log($"Dialog result: {result}");
    }

    async Task ShowBusyDialog(bool withMessageAsString)
    {
        InvokeAsync(async () =>
        {
            // Simulate background task
            await Task.Delay(2000);

            // Close the dialog
            DialogService.Close();
        });

        if (withMessageAsString)
        {
            await BusyDialog("Busy ...");
        }
        else
        {
            await BusyDialog();
        }
    }

    // Busy dialog from markup
    async Task BusyDialog()
    {
        await DialogService.OpenAsync("", ds =>
            @<div>
                <div class="row">
                    <div class="col-md-12">
                        Loading...
                    </div>
                </div>
        </div>, new DialogOptions() { ShowTitle = false, Style = "min-height:auto;min-width:auto;width:auto" });
    }

    // Busy dialog from string
    async Task BusyDialog(string message)
    {
        await DialogService.OpenAsync("", ds =>
        {
            RenderFragment content = b =>
            {
                b.OpenElement(0, "div");
                b.AddAttribute(1, "class", "row");

                b.OpenElement(2, "div");
                b.AddAttribute(3, "class", "col-md-12");

                b.AddContent(4, message);

                b.CloseElement();
                b.CloseElement();
            };
            return content;
        }, new DialogOptions() { ShowTitle = false, Style = "min-height:auto;min-width:auto;width:auto" });
    }
}